Vue.component('my-header', {
    data: function () {
        return {}
    },
    methods: {},
    created: function () {

    },
    template: `
   <el-header height="72px" style="border: 1px solid #f4f4f4">
        <div class="center" >
            <el-row gutter="20">
               <el-col span="2">
                   <img src="./imgs/首页log1.jpg" style="width: 92px ;height:41px ;margin-top: 20px ;float: left" >
               </el-col>
                <el-col span="4">
                    <el-popover placement="top-start" trigger="hover" >
                        <div slot="reference">
                            <i class="el-icon-location-outline"></i>
                            合肥
                            <img src="./imgs/首页下箭头.png" style="width: 15px;height: 10px">
                            <i class="i-arrow-location"></i>
                        </div>
                        <a href="" class="head_city_a"><span class="head_city">全国</span></a>
                        <a href="" class="head_city_a"><span class="head_city">北京</span></a>
                        <a href="" class="head_city_a"><span class="head_city">上海</span></a><br><br>
                        <a href="" class="head_city_a"><span class="head_city">广州</span></a>
                        <a href="" class="head_city_a"><span class="head_city">深圳</span></a>
                        <a href="" class="head_city_a"><span class="head_city">合肥</span></a>


                    </el-popover>

                </el-col>
                <el-col span="6">
                   <a href="Index.html">首页</a>
                   <a href="classification_new.html">分类</a>
                </el-col>
                <el-col span="8" style="padding: 0">

                    <input class="input-search" placeholder="搜索明星、演出" >
                    <button class="button-search">搜索</button>
                </el-col>
                <el-col span="2" style="margin-bottom: 20px;">
                    <el-popover placement="top-start" trigger="hover" >
                        <div slot="reference">
                            <i style="font-size: 30px; position:relative;top: 5px"
                               class="el-icon-user"></i>
                        </div>
                        <div  >
                            <a>个人信息</a><br>
                            <hr>
                            <a>账号设置</a><br>
                            <hr>
                            <a>订单管理</a><br>
                            <hr>
                            <a>退出登录</a><br>
                        </div>

                    </el-popover>
                </el-col>
                <el-col span="2" style="margin-bottom: 20px">
                    <el-popover placement="top-start" trigger="hover">
                        <div slot="reference">
                            <i style="font-size: 30px; position:relative;top: 20px"
                               class="el-icon-mobilephone"></i>
                        下载</div>
                        <img src="./imgs/二维码.jpg" width="150px" height="150px">
                    </el-popover>
                </el-col>
            </el-row>
        </div>
    </el-header>
    `
})